<ul class="clean" id="filters">
	<? foreach($this->filters as $type=>$items): ?>
	
	<? 
		$filter = $this->getFilter($type);
		$click = $filter ? "UnMark(this, '$type');" : "";
	?>
	
	<li class="<?= $filter ? "marked" : "" ?>" onclick="<?= $click; ?>">
		<strong><?= $type; ?>:</strong>
		<? if($filter): ?>
			<span class="filter-selected"><?= $filter["name"]; ?></span>
		<? endif; ?>
		
		<ul class="filters-list clean" style="display:none">
		<? foreach($items as $id=>$label): ?>
			<li><a href="/category/show/<?= $id ?>/<?= urlize($label); ?>"><?= $label; ?></a></li>
		<? endforeach; ?>
		</ul>
		
	</li>
	<? endforeach; ?>
</ul>

<script type="text/javascript">
function UnMark(li, tag){
	li = $(li);
	
	$.ajax({
		url: '/category/unset_filter/' + tag,
		beforeSend: function(){
			li.addClass("loading");
		},
		complete: function(req){
			li.removeClass("loading");
			if(req.status==200){
				li.find('.filter-selected').hide();
				li.find('.filters-list').show();
				li.removeClass('marked').addClass('opened');
			}
		}
	});
}
$("#filters strong").click(function(){
	var li = $(this).parent();
	if(!li.hasClass("marked")){
		var ul = $(this).parent().find(".filters-list");
		if(ul.is(":visible")){
			li.removeClass("opened");
			ul.hide();
		}else{
			li.addClass("opened");
			ul.show();
		}
	}
	return false;
});
</script>